
    <link rel="stylesheet" href="timeline.css">

<body>





    <section>事件</section>
    <div class="content content_p">
        <span class="icon_start"></span>
        <ol id="timeline">
            <li class="cf">
                <span class="dot_s"></span>
            </li>
            <li class="cf" style="margin-top:20px;">
                <span class="num">15</span>

                <div class="away">
                    <span class="arrow"></span>
                    <p>
                        <a href="dongqiudi:///player/50129082" class="person">
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/G.png">
                                            <span class="text_lim"> N. Bonilla </span>
                                        </a>
                    </p>
                    <p>
                        <a href="dongqiudi:///player/50220326" class="person">
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/AS.png">
                                            <span class="text_lim"> R. Marroquin </span>
                                        </a>
                    </p>
                </div>
            </li>
            <li class="cf" style="margin-top:20px;">
                <span class="num">46</span>
                <div class="home">
                    <span class="arrow"></span>
                    <p>
                        <a href="dongqiudi:///player/50157983" class="person">
                                            <span class="text_lim"> O. Gordon </span>
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SI.png">
                                        </a>
                    </p>
                    <p>
                        <a href="dongqiudi:///player/50209263" class="person">
                                            <span class="text_lim"> C. Burke </span>
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SO.png">
                                        </a>
                    </p>
                </div>

            </li>
            <li class="cf" style="margin-top:20px;">
                <span class="num">47</span>
                <div class="home">
                    <span class="arrow"></span>
                    <p>
                        <a href="dongqiudi:///player/50112651" class="person">
                                            <span class="text_lim"> R. Williams </span>
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/YC.png">
                                        </a>
                    </p>
                </div>

            </li>
            <li class="cf" style="margin-top:20px;">
                <span class="num">63</span>

                <div class="away">
                    <span class="arrow"></span>
                    <p>
                        <a href="dongqiudi:///player/50196134" class="person">
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/YC.png">
                                            <span class="text_lim"> N. Orellana </span>
                                        </a>
                    </p>
                </div>
            </li>
            <li class="cf" style="margin-top:20px;">
                <span class="num">64</span>
                <div class="home">
                    <span class="arrow"></span>
                    <p>
                        <a href="dongqiudi:///player/50144408" class="person">
                                            <span class="text_lim"> D. Mattocks </span>
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/PG.png">
                                        </a>
                    </p>
                </div>

            </li>
            <li class="cf" style="margin-top:20px;">
                <span class="num">65</span>
                <div class="home">
                    <span class="arrow"></span>
                    <p>
                        <a href="dongqiudi:///player/50251990" class="person">
                                            <span class="text_lim"> 宾斯 </span>
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SI.png">
                                        </a>
                    </p>
                    <p>
                        <a href="dongqiudi:///player/50103570" class="person">
                                            <span class="text_lim"> O. Fisher </span>
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SO.png">
                                        </a>
                    </p>
                </div>

            </li>
            <li class="cf" style="margin-top:20px;">
                <span class="num">70</span>

                <div class="away">
                    <span class="arrow"></span>
                    <p>
                        <a href="dongqiudi:///player/50108601" class="person">
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SI.png">
                                            <span class="text_lim"> Ó. Cerén </span>
                                        </a>
                    </p>
                    <p>
                        <a href="dongqiudi:///player/50048510" class="person">
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SO.png">
                                            <span class="text_lim"> G. Mayén </span>
                                        </a>
                    </p>
                </div>
            </li>
            <li class="cf" style="margin-top:20px;">
                <span class="num">80</span>

                <div class="away">
                    <span class="arrow"></span>
                    <p>
                        <a href="dongqiudi:///player/50187603" class="person">
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SI.png">
                                            <span class="text_lim"> R. Menjívar </span>
                                        </a>
                    </p>
                    <p>
                        <a href="dongqiudi:///player/50129082" class="person">
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SO.png">
                                            <span class="text_lim"> N. Bonilla </span>
                                        </a>
                    </p>
                </div>
            </li>
            <li class="cf" style="margin-top:20px;">
                <span class="num">87</span>

                <div class="away">
                    <span class="arrow"></span>
                    <p>
                        <a href="dongqiudi:///player/50387066" class="person">
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SI.png">
                                            <span class="text_lim"> H. Alas </span>
                                        </a>
                    </p>
                    <p>
                        <a href="dongqiudi:///player/50196134" class="person">
                                            <img src="http://img.dongqiudi.com/soccer/data/logo/event/SO.png">
                                            <span class="text_lim"> N. Orellana </span>
                                        </a>
                    </p>
                </div>
            </li>
        </ol>
        <span class="dot"></span>
        <span class="icon_end"></span>
    </div>
    <div class="show">
        <div class="show_main">
            <span><img src="http://static1.dongqiudi.com/web-new/static/api/images/eventpic/icon_goal.png" alt="进球">进球</span>
            <span><img src="http://static1.dongqiudi.com/web-new/static/api/images/eventpic/icon_point.png" alt="点球">点球</span>
            <span><img src="http://static1.dongqiudi.com/web-new/static/api/images/eventpic/icon_point_1.png" alt="点球未进">点球未进</span>
            <span><img src="http://static1.dongqiudi.com/web-new/static/api/images/eventpic/icon_w.png" alt="乌龙球">乌龙球</span>
            <span><img src="http://static1.dongqiudi.com/web-new/static/api/images/eventpic/icon_a.png" alt="助攻">助攻</span>
        </div>
    </div>

    <section>技术统计</section>
    <div class="status">
        <table class="head">
            <tbody>
                <tr>
                    <th class="away">
                        <a href="dongqiudi:///team/50001117 " class="team">
                            <span class="text_lim">牙买加</span> <img src="http://img.dongqiudi.com/data/pic/1319.png" onerror="this.src='http://static1.dongqiudi.com/web-new/web/images/defaultTeam.png'" alt="">
                        </a>
                    </th>
                    <th class="name">&nbsp;</th>
                    <th class="home">
                        <a href="dongqiudi:///team/50000512 " class="team">
                            <img src="http://img.dongqiudi.com/data/pic/659.png" onerror="this.src='http://static1.dongqiudi.com/web-new/web/images/defaultTeam.png'" alt=""> <span class="text_lim">萨尔瓦多</span>
                        </a>
                    </th>
                </tr>
            </tbody>
        </table>

        <table>
            <tbody>
                <tr>
                    <td class="away">
                        <span class="num">48</span>
                        <span class="rank">
                        <span class="ranks ranks_l" style="width:48%"></span>
                        </span>

                    </td>
                    <td class="name">控球率</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks " style="width:52%"></span>
                        </span>
                        <span class="num">52</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">8</span>
                        <span class="rank">
                        <span class="ranks ranks_l" style="width:47%"></span>
                        </span>

                    </td>
                    <td class="name">射门</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks " style="width:53%"></span>
                        </span>
                        <span class="num">9</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">4</span>
                        <span class="rank">
                        <span class="ranks " style="width:57%"></span>
                        </span>

                    </td>
                    <td class="name">射正</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks ranks_l" style="width:43%"></span>
                        </span>
                        <span class="num">3</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">2</span>
                        <span class="rank">
                        <span class="ranks " style="width:50%"></span>
                        </span>

                    </td>
                    <td class="name">封堵</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks " style="width:50%"></span>
                        </span>
                        <span class="num">2</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">1</span>
                        <span class="rank">
                        <span class="ranks " style="width:100%"></span>
                        </span>

                    </td>
                    <td class="name">点球</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks ranks_l" style="width:0%"></span>
                        </span>
                        <span class="num">0</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">10</span>
                        <span class="rank">
                        <span class="ranks ranks_l" style="width:43%"></span>
                        </span>

                    </td>
                    <td class="name">任意球</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks " style="width:57%"></span>
                        </span>
                        <span class="num">13</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">6</span>
                        <span class="rank">
                        <span class="ranks " style="width:50%"></span>
                        </span>

                    </td>
                    <td class="name">角球</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks " style="width:50%"></span>
                        </span>
                        <span class="num">6</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">3</span>
                        <span class="rank">
                        <span class="ranks " style="width:100%"></span>
                        </span>

                    </td>
                    <td class="name">越位</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks ranks_l" style="width:0%"></span>
                        </span>
                        <span class="num">0</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">2</span>
                        <span class="rank">
                        <span class="ranks ranks_l" style="width:40%"></span>
                        </span>

                    </td>
                    <td class="name">换人</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks " style="width:60%"></span>
                        </span>
                        <span class="num">3</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">10</span>
                        <span class="rank">
                        <span class="ranks " style="width:50%"></span>
                        </span>

                    </td>
                    <td class="name">犯规</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks " style="width:50%"></span>
                        </span>
                        <span class="num">10</span>
                    </td>
                </tr>

                <tr>
                    <td class="away">
                        <span class="num">1</span>
                        <span class="rank">
                        <span class="ranks " style="width:50%"></span>
                        </span>

                    </td>
                    <td class="name">黄牌</td>
                    <td class="home">
                        <span class="rank">
                        <span class="ranks " style="width:50%"></span>
                        </span>
                        <span class="num">1</span>
                    </td>
                </tr>

            </tbody>
        </table>
    </div>

    <section>相关新闻</section>
    <div id="app_news">
        <dl>
            <dd>
                <a href="dongqiudi:///news/380975">
                    <div class="img_news" style="background-image:url(http://img1.dongqiudi.com/fastdfs1/M00/9A/92/180x135/crop/-/pIYBAFlrQ3yABiTMAACbcTDWZOA613.jpg)"></div>
                    <p>
                        足彩边角料：牙买加防守能力出色，库拉索主力门将实力不俗
                    </p>
                    <span>18评论</span>
                </a>
            </dd>
        </dl>
    </div>



    <script type="text/javascript">
        // User Agent
        window.browers = {};
        var ua = navigator.userAgent.toLowerCase();
        browers.iPad = ua.match(/ipad/);
        browers.iPhone = ua.match(/iphone/);
        browers.Android = ua.match(/android/);
        browers.iOS = ua.match(/ipad|iphone|ios/);
        browers.ie = ua.match(/iemobile/);
        isWifi = ua.match(/nettype\/wifi|technology\/wifi/);
        var match_status = "Played";

        var article_exist = true;
        var event_exist = true;
        var gif_exist = false;
        var statistic_exist = true;
        var relateArticle_exist = true;


        var app_ua = ua.match(/(NewsApp|LiveApp)\/([\d\.]+)/i),
            version;

        // 系统版本
        sys_version = 0;
        if (browers.iOS) {
            var matches = ua.match(/; CPU OS ([\d_]+) like Mac OS X/i);
            if (matches) {
                sys_version = parseFloat(matches[1].replace(eval('/_/ig'), '.'));
            }
        }

        if (app_ua) {
            v = app_ua[2].replace(eval('/\\./ig'), '');
            version = parseInt(v);
            if (v.length == 2) {
                version = version * 10;
            }
        }

        function connectWebViewJavascriptBridge(callback) {
            if (window.WebViewJavascriptBridge) {
                callback(WebViewJavascriptBridge)
            } else {
                document.addEventListener('WebViewJavascriptBridgeReady', function () {
                    callback(WebViewJavascriptBridge)
                }, false)
            }
        }

        connectWebViewJavascriptBridge(function (bridge) {
            bridge.init(function (message, responseCallback) {});

            if (browers.iOS && version > 261) {
                if (version <= 330) {
                    setVideos(null);
                } else {
                    setVideos(bridge);
                }
            }
        });

        // Video Holder
        function setVideos(bridge) {
            // // Video Holder
            if ((bridge && version >= 430) || (browers.Android && version >= 820) || (browers.Android && 100 <= version <=
                    102)) { //测试4.12以上的
                // if(!browers){
                if (browers.iOS) {
                    bridge.registerHandler('videoIsPlaying', function (arg) {
                        videoIsPlaying(arg);
                    });
                }

                newVersionVideoSet(bridge);
            } else {
                // iPhone & Android
                $('.video').each(function () {
                    var holder;
                    var site = $(this).attr('site');
                    var src = $(this).attr('src');
                    var thumb = $(this).attr('thumb');
                    var hash = $(this).attr('hash');
                    var title = $(this).attr('title');
                    var type = $(this).attr('mode');
                    if (((browers.Android && version > 510) || (browers.iOS && version > 330) || (browers.iOS &&
                            sys_version >= 9))) {
                        var holder = $('<div class="media-container media-container-video" src="' + src +
                            '"><div class="media-holder media-holder-video"></div></div>');
                        // Background
                        if (thumb) {
                            holder.css('background', 'url("' + thumb + '") no-repeat center center');
                        }
                        holder.on('click', function () {
                            // 乐视视频,iOS 9.0以下 跳回源站播放
                            if (site == 'letv' || site == 'sina' || site == 'qq' || (browers.iOS &&
                                    sys_version >= 9)) {
                                if (site == 'letv' || site == 'sina' || site == 'qq') {
                                    window.location.href = '/video/redirect/' + hash;
                                } else {
                                    window.location.href = src;
                                }
                                return;
                            }
                            if (browers.Android) {
                                Android.play(site, src, hash);
                            } else {
                                if (bridge) {
                                    if (version == 344 && site != 'pptv') hash = 'disable';
                                    if (version <= 381 && site == 'youku') src = '';
                                    if (version >= 384) {
                                        bridge.callHandler('play', {
                                            'url': src,
                                            'stream': hash,
                                            'referer': src
                                        });
                                    } else {
                                        bridge.callHandler('play', {
                                            'url': src,
                                            'stream': hash
                                        });
                                    }

                                }
                            }
                        });
                    } else {
                        if (site == 'sina' || site == 'qq' || site == 'letv') {
                            holder = $('<div class="media-container media-container-video" src="' + src +
                                '"><div class="media-holder media-holder-video"></div></div>');
                            holder.on('click', function () {
                                window.location.href = '/video/redirect/' + hash;
                                return;
                            });
                        } else {
                            holder = $('<iframe frameborder="0" class="media-iframe" src="' + src +
                                '" allowfullscreen></iframe>');
                        }
                    }
                    if (holder) {
                        width = $('.content').width();
                        height = (width / 16) * 9;
                        holder.css('background-color', '#ccc');
                        holder.css('height', height);
                        holder.css('width', width);
                        $(this).replaceWith(holder);
                    }
                });
            }
        }

        function newVersionVideoSet(bridge) {

            $('.video').each(function () {
                var site = $(this).attr('site');
                var src = $(this).attr('src');
                var thumb = $(this).attr('thumb');
                var hash = $(this).attr('hash');
                var title = $(this).attr('title');
                var type = $(this).attr('mode');
                var holder = $('<div class="media-container media-container-video" src="' + src +
                    '"><div class="media-holder media-holder-video"></div></div>');
                var mask = '<div class="mask"></div>';
                if (thumb) {
                    holder.css('background', 'url("' + thumb + '") no-repeat center center');
                    holder.css('background-size', 'cover');
                }
                if (holder) {
                    width = $('.content').width();
                    height = (width / 16) * 9;
                    holder.css({
                        'background-color': '#ccc',
                        'width': width,
                        'height': height
                    });
                    $(this).append(mask);
                    $(this).append(holder);
                }
                $(this).delegate('.media-holder-video', 'click', function () {
                    if (browers.Android) {
                        if (type === 'browser') { //外部浏览器中打开
                            Android.startBrowser(src, 1, src);
                        } else if (type === 'h5') { //内部浏览器中打开
                            Android.startBrowser(src, 0, src);
                        } else { //应用内打开
                            Android.play(site, src, hash);
                        }
                    } else if (bridge) {
                        if (type === 'browser') { //外部浏览器中打开
                            bridge.callHandler('startBrowser', {
                                'url': src,
                                'target': 1,
                                'src': src
                            });

                        } else if (type === 'h5') { //内部浏览器中打开
                            bridge.callHandler('startBrowser', {
                                'url': src,
                                'target': 0,
                                'src': src
                            });
                        } else { //应用内打开
                            bridge.callHandler('play', {
                                'url': src,
                                'stream': hash,
                                'referer': src
                            });
                        }

                    }
                });

            });
        };

        function videoIsPlaying(arg) {
            var videos = $('body').find('.video');
            var src = arg.src;
            var status = arg.status;
            if (status) {
                videos.each(function () {
                    if ($(this).attr('src') !== src) {
                        $(this).removeClass('playing');
                    } else {
                        $(this).addClass('playing');
                    }
                });
            } else {
                videos.removeClass('playing');
            }
        }

        $(function () {
            $('.gif_container a').click(function () {
                $(this).css('color', '#999999')
            });

            if (browers.Android && !gif_exist && !article_exist && !event_exist && !statistic_exist && !
                relateArticle_exist) {
                Android.empty();
            }
            if (browers.iOS && version > 261) {

            } else if (browers.Android || (browers.iOS && version <= 261)) {
                setVideos(null);
            } else {
                setVideos(null);
            }
        });
    </script>


</body>